<!DOCTYPE html>
<html>
<head>
	<title>Deezloader Remix</title>
	<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
	<link rel="stylesheet" type="text/css" href="css/material-icons.css"/>
	<link rel="stylesheet" type="text/css" href="css/materialize.min.css"/>
	<link rel="stylesheet" type="text/css" href="css/animate.css">
	<link rel="stylesheet" type="text/css" href="css/style.css"/>
	<link rel="stylesheet" type="text/css" href="css/darkMode.css" name="darkMode" disabled/>
	<script type='text/javascript'>
		if (eval(localStorage.darkMode)){
			document.getElementsByName("darkMode")[0].removeAttribute("disabled");
		}
	</script>
	<meta charset="utf-8"/>
</head>
<body>
<span id="appVersionFallback" hidden>4.2.3</span>

<div id="title-bar" class="deezloader-black">
	<div class="resize-padding" style="width: 100%; height: 3px;"></div>
	<div class="resize-padding" style="width: 3px; height: 31px;"></div>
	<div id="title">Deezloader Remix v<span id="application_version"></span></div>

	<div id="title-bar-btns">
		<button id="min-btn"><i class="material-icons">remove</i></button>
		<button id="max-btn"><i class="material-icons">add</i></button>
		<button id="close-btn"><i class="material-icons">close</i></button>
	</div>

	<div class="resize-padding" style="position: absolute; top:0; right:0px; width: 3px; height: 31px;"></div>
</div>

<!--#############################################INITIALIZING-SCREEN############################################-->
<div id="initializing" class="valign-wrapper">
	<div class="modal-content container" id="login-page">
		<div class="card">
			<div class="card-content">
				<span class="card-title"><%= __('Please login to your deezer account')%>.</span>
				<h6 class="red-text" id="login-res-text"></h6>
				<div id="login-form-client-mode">
					<div class="input-field col s12">
						<input autocomplete="off" type="text" id="modal_login_input_username"/>
						<label for="modal_login_input_username"><%= __('Email')%></label>
					</div>
					<div class="input-field col s12">
						<input autocomplete="off" type="password" id="modal_login_input_password"/>
						<label for="modal_login_input_password"><%= __('Password')%></label>
					</div>
					<input id="modal_login_input_captchaResponse" type="hidden" value=""/>
					<!--<iframe id="modal_login_iframe_captcha" src="cap://deezer.com/"></iframe>-->
				</div>
				<div id="login-form-server-mode">
					<div class="input-field col s12">
						<input autocomplete="off" type="password" id="modal_login_input_userToken"/>
						<label for="modal_login_input_userToken"><%= __('userToken')%></label>
					</div>
					<p><a href="https://notabug.org/RemixDevs/DeezloaderRemix/wiki/Login+via+userToken" target="_blank"><%= __('How do I get my userToken?')%></a></p>
				</div>
			</div>
			<div class="card-action row">
				<a href="#" class="deezloader-primary col s12 m2 waves-effect waves-light btn" id="modal_login_btn_login"><%= __('Log in')%></a>
				<a href="#" class="deezloader-secondary col s12 m2 waves-effect waves-light btn" id="modal_login_btn_signup"><%= __('Sign up')%></a>
			</div>
		</div>
	</div>
</div>

<!--#############################################MODAL_SETTINGS############################################-->
<div id="modal_settings" class="modal modal-fixed-footer">
	<div class="modal-content">
		<h4 class="col s12"><%= __('Settings')%></h4>

		<h6 class="col s12 secondary-text"><%= __('Path Settings')%></h6><hr>
		<div class="row">
			<div class="input-field col s12">
				<input autocomplete="off" type="text" id="modal_settings_input_downloadTracksLocation"/>
				<label for="modal_settings_input_downloadTracksLocation"><%= __('Download folder path')%></label>
			</div>
		</div>

		<div class="row">
			<div class="input-field col s12">
				<input autocomplete="off" type="text" id="modal_settings_input_trackNameTemplate"/>
				<label for="modal_settings_input_trackNameTemplate"><%= __('Tracknames template')%> <i class="material-icons valignicon tiny tooltipped" data-position="right" data-delay="50"
					data-tooltip="<%= __('Supported variables are')%>: %title%, %album%, %artist%, %year%, %date%, %label%, %number%, %disc%, %isrc%, %explicit%, %genre%">info_outline</i></label>
			</div>
		</div>

		<div class="row">
			<div class="input-field col s12 m6">
				<input autocomplete="off" type="text" id="modal_settings_input_albumTrackNameTemplate"/>
				<label for="modal_settings_input_albumTrackNameTemplate"><%= __('Album tracknames template')%> <i class="material-icons valignicon tiny tooltipped" data-position="right" data-delay="50"
					data-tooltip="<%= __('Supported variables are')%>: %title%, %album%, %artist%, %year%, %date%, %label%, %number%, %disc%, %isrc%, %explicit%, %genre%">info_outline</i></label>
			</div>
			<div class="input-field col s12 m6">
				<input autocomplete="off" type="text" id="modal_settings_input_albumNameTemplate"/>
				<label for="modal_settings_input_albumNameTemplate"><%= __('Album names template')%> <i class="material-icons valignicon tiny tooltipped" data-position="right" data-delay="50"
					data-tooltip="<%= __('Supported variables are')%>: %album%, %artist%, %year%, %date%, %bitrate%, %type%, %label%, %album_id%, %upc%, %explicit%, %genre%">info_outline</i></label>
			</div>
		</div>

		<div class="row">
			<div class="input-field col s12">
				<input autocomplete="off" type="text" id="modal_settings_input_playlistTrackNameTemplate"/>
				<label for="modal_settings_input_playlistTrackNameTemplate"><%= __('Playlist tracknames template')%> <i class="material-icons valignicon tiny tooltipped" data-position="right" data-delay="50"
					data-tooltip="<%= __('Supported variables are')%>: %title%, %album%, %artist%, %year%, %date%, %label%, %number%, %position%, %disc%, %isrc%, %explicit%, %genre%">info_outline</i></label>
			</div>
		</div>

		<h6 class="col s12 secondary-text"><%= __('More Path Settings')%></h6><hr>
		<div class="row">
			<div class="col s12 switch settings_switch">
				<span><%= __('Create folders for Artists')%></span>
				<label>
					<input type="checkbox" id="modal_settings_cbox_createArtistFolder"/>
					<span class="lever"></span>
				</label>
			</div>
			<div class="col s12 switch settings_switch">
				<span><%= __('Create folders for Albums')%></span>
				<label>
					<input type="checkbox" id="modal_settings_cbox_createAlbumFolder"/>
					<span class="lever"></span>
				</label>
			</div>
			<div class="col s12 switch settings_switch">
				<span><%= __('Create folders for CDs')%></span>
				<label>
					<input type="checkbox" id="modal_settings_cbox_createCDFolder" class="filled-in"/>
					<span class="lever"></span>
				</label>
			</div>
			<div class="col s12 switch settings_switch">
				<span><%= __('Create Artist, Albums and CDs folders for Playlists too')%></span>
				<label>
					<input type="checkbox" id="modal_settings_cbox_createFoldersPlaylist" class="filled-in"/>
					<span class="lever"></span>
				</label>
			</div>
			<div class="col s12 switch settings_switch">
				<span><%= __('Write all Artists in track filename')%></span>
				<label>
					<input type="checkbox" id="modal_settings_cbox_saveFullArtists" class="filled-in"/>
					<span class="lever"></span>
				</label>
			</div>
			<div class="col s12 switch settings_switch">
				<span class="tooltipped" data-position="top" data-delay="500"
					data-tooltip="<%= __('Adds 0s before %number% to have the same character length')%>"><%= __('Add padding to track numbers')%></span>
				<label>
					<input type="checkbox" id="modal_settings_cbox_padtrck" class="filled-in"/>
					<span class="lever"></span>
				</label>
			</div>
			<div class="input-field col s12">
				<input autocomplete="off" type="number" id="modal_settings_number_paddingSize" min="0"/>
				<label for="modal_settings_number_paddingSize"><%= __('Overwrite padding size')%></label>
			</div>
		</div>

		<h6 class="col s12 secondary-text"><%= __('App Settings')%></h6><hr>
		<div class="row">
			<div class="input-field col s12 m6">
				<input autocomplete="off" type="number" id="modal_settings_number_queueConcurrency" min="1"/>
				<label for="modal_settings_number_queueConcurrency"><%= __('Concurrent download limit')%></label>
			</div>
			<div class="input-field col s12 m6">
				<select name="maxBitrate" id="modal_settings_select_maxBitrate">
					<option value="9">FLAC 1411kbps</option>
					<option value="3">MP3 320kbps</option>
					<option value="1">MP3 128kbps</option>
				</select>
				<label for="modal_settings_select_maxBitrate"><%= __('Preferred bitrate')%></label>
			</div>
			<div class="input-field col s12 m6">
				<select name="lang" id="modal_settings_select_lang">
					<option value="en">English</option>
					<option value="fr">Français</option>
					<option value="it">Italiano</option>
					<option value="de">Deutsch</option>
					<option value="es">Español</option>
					<option value="tr">Türkçe</option>
					<option value="pt-BR">Português do Brasil</option>
					<option value="fa">فارسی</option>
					<option value="th">ภาษาไทย</option>
					<option value="uwu">engwish uwu</option>
				</select>
				<label for="modal_settings_select_lang"><%= __('Language')%></label>
			</div>
			<div class="col s12 switch settings_switch">
				<span><%= __('Fallback to lower bitrates if preferred is not available')%></span>
				<label>
					<input type="checkbox" id="modal_settings_cbox_fallbackBitrate" class="filled-in"/>
					<span class="lever"></span>
				</label>
			</div>
			<div class="col s12 switch settings_switch">
				<span><%= __('Fallback to search if song is not available')%></span>
				<label>
					<input type="checkbox" id="modal_settings_cbox_fallbackSearch" class="filled-in"/>
					<span class="lever"></span>
				</label>
			</div>
			<div class="col s12 switch settings_switch">
				<span><%= __('Download albums with one track as a single track')%></span>
				<label>
					<input type="checkbox" id="modal_settings_cbox_downloadSinglesAsTracks" class="filled-in"/>
					<span class="lever"></span>
				</label>
			</div>
			<div class="col s12 switch settings_switch">
				<span><%= __('Create log file for Errors inside download folder')%></span>
				<label>
					<input type="checkbox" id="modal_settings_cbox_logErrors" class="filled-in"/>
					<span class="lever"></span>
				</label>
			</div>
			<div class="col s12 switch settings_switch">
				<span><%= __('Create log file for Alternatives inside download folder')%></span>
				<label>
					<input type="checkbox" id="modal_settings_cbox_logSearched" class="filled-in"/>
					<span class="lever"></span>
				</label>
			</div><div class="col s12 switch settings_switch">
				<span><%= __('Create M3U8 (Playlist) File')%></span>
				<label>
					<input type="checkbox" id="modal_settings_cbox_createM3UFile" class="filled-in"/>
					<span class="lever"></span>
				</label>
			</div>
			<div class="col s12 switch settings_switch">
				<span><%= __('Download Synced Lyrics File (.lrc)')%></span>
				<label>
					<input type="checkbox" id="modal_settings_cbox_syncedlyrics" class="filled-in"/>
					<span class="lever"></span>
				</label>
			</div>
			<div class="col s12 switch settings_switch">
				<span><%= __('Minimize to system tray')%></span>
				<label>
					<input type="checkbox" id="modal_settings_cbox_minimizeToTray" class="filled-in"/>
					<span class="lever"></span>
				</label>
			</div>
		</div>

		<h6 class="col s12 secondary-text"><%= __('Artworks')%></h6><hr>
		<div class="row">
			<div class="input-field col s12">
				<select name="artworkSize" id="modal_settings_select_artworkSize">
					<option value="2000">2000x2000</option>
					<option value="1400">1400x1400</option>
					<option value="1200">1200x1200</option>
					<option value="1000">1000x1000</option>
					<option value="800">800x800</option>
					<option value="500">500x500</option>
					<option value="250">250x250</option>
				</select>
				<label for="modal_settings_select_artworkSize"><%= __('Artwork Size')%></label>
			</div>
			<div class="col s12 switch settings_switch">
				<span><%= __('Save Album Artwork')%></span>
				<label>
					<input type="checkbox" id="modal_settings_cbox_saveArtwork" class="filled-in"/>
					<span class="lever"></span>
				</label>
			</div>
			<div class="input-field col s12">
				<input autocomplete="off" type="text" id="modal_settings_input_coverImageTemplate"/>
				<label for="modal_settings_input_albumTrackNameTemplate"><%= __('Album Artwork Name Template')%> <i class="material-icons valignicon tiny tooltipped" data-position="right" data-delay="50"
					data-tooltip="<%= __('Supported variables are')%>: %artist% and %name%">info_outline</i></label>
			</div>
			<div class="col s12 switch settings_switch">
				<span><%= __('Save Artist Artwork')%></span>
				<label>
					<input type="checkbox" id="modal_settings_cbox_saveArtworkArtist" class="filled-in"/>
					<span class="lever"></span>
				</label>
			</div>
			<div class="input-field col s12">
				<input autocomplete="off" type="text" id="modal_settings_input_artistImageTemplate"/>
				<label for="modal_settings_input_albumNameTemplate"><%= __('Artist Artwork Name Template')%><i class="material-icons valignicon tiny tooltipped" data-position="right" data-delay="50"
					data-tooltip="<%= __('Supported variables are')%>: %artist%">info_outline</i></label>
			</div>
			<div class="col s12 switch settings_switch">
				<span><%= __('Download images as PNGs')%></span>
				<label>
					<input type="checkbox" id="modal_settings_cbox_PNGcovers" class="filled-in"/>
					<span class="lever"></span>
				</label>
			</div>
		</div>

		<h6 class="col s12 secondary-text"><%= __('Tags')%></h6><hr>
		<div class="row">
			<div class="input-field col s12">
				<select name="multitagSeparator" id="modal_settings_select_multitagSeparator">
					<option value="null"><%= __('Null Character')%></option>
					<option value=",">,</option>
					<option value=", ">, <%= __('with space')%></option>
					<option value="/">/</option>
					<option value=" / ">/ <%= __('with space')%></option>
					<option value=";">;</option>
					<option value="; ">; <%= __('with space')%></option>
				</select>
				<label for="modal_settings_select_multitagSeparator"><%= __('Multitag Separator')%></label>
			</div>
			<div class="input-field col s12 m6">
				<select name="dateFormat" id="modal_settings_select_dateFormat">
					<option value="0"><%= __('YY')%>/<%= __('MM')%>/<%= __('DD')%></option>
					<option value="1"><%= __('DD')%>/<%= __('MM')%>/<%= __('YY')%></option>
					<option value="2"><%= __('MM')%>/<%= __('DD')%>/<%= __('YY')%></option>
					<option value="3"><%= __('YY')%>/<%= __('DD')%>/<%= __('MM')%></option>
				</select>
				<label for="modal_settings_select_dateFormat"><%= __('Date Format')%></label>
			</div>
			<div class="input-field col s12 m6">
				<select name="dateFormatYear" id="modal_settings_select_dateFormatYear">
					<option value="2">2 <%= __('digit')%></option>
					<option value="4">4 <%= __('digit')%></option>
				</select>
				<label for="modal_settings_select_dateFormatYear"><%= __('Year Format')%></label>
			</div>
			<div class="col s12 switch settings_switch">
				<span class="tooltipped" data-position="top" data-delay="500"
					data-tooltip="<%= __('Replaces albums tags with the playlist ones')%>"><%= __('Save Playlist as Compilation')%></span>
				<label>
					<input type="checkbox" id="modal_settings_cbox_savePlaylistAsCompilation" class="filled-in"/>
					<span class="lever"></span>
				</label>
			</div>
			<div class="col s12 switch settings_switch">
				<span><%= __('Remove \"(Album Version)\" from tracknames')%></span>
				<label>
					<input type="checkbox" id="modal_settings_cbox_removeAlbumVersion" class="filled-in"/>
					<span class="lever"></span>
				</label>
			</div>
			<div class="col s12 switch settings_switch">
				<span><%= __('Save ID3v1 tags as well')%></span>
				<label>
					<input type="checkbox" id="modal_settings_cbox_saveID3v1" class="filled-in"/>
					<span class="lever"></span>
				</label>
			</div>
		</div>

		<div class="row">
			<div class="col s12">
				<a href="#modal_tags" class="modal-trigger waves-effect waves-light btn btn-large" style="width:100%;"><%= __('Choose Which Tags To Save')%></a>
			</div>
		</div>

		<h6 class="col s12 secondary-text"><%= __('Spotify Features')%></h6><hr>
		<p class="secondary-text"><%- __('SpotifyFeatures_Info')%></p>
		<div class="row">
			<div class="input-field col s12 m6">
				<input autocomplete="off" type="text" id="modal_settings_input_spotifyClientID"/>
				<label for="modal_settings_input_spotifyClientID"><%= __('Client ID')%></label>
			</div>
			<div class="input-field col s12 m6">
				<input autocomplete="off" type="password" id="modal_settings_input_spotifyClientSecret"/>
				<label for="modal_settings_input_spotifyClientSecret"><%= __('Client Secret')%></label>
			</div>
			<div class="input-field col s12 m6">
				<input autocomplete="off" type="text" id="modal_settings_input_spotifyUser"/>
				<label for="modal_settings_input_spotifyUser"><%= __('Spotify Username (for the Playlists Tab)')%></label>
			</div>
		</div>

		<div class="row">
			<div class="col s12">
				<img id="modal_settings_picture" src="" alt="Profile Picture" class="circle left" style="height:125px; margin-right: 12px;"/>
				<p><%= __('You are logged in as')%> <b id="modal_settings_username"></b></p>
				<a href="#" class="modal-close waves-effect waves-light btn" id="modal_settings_btn_logout"><%= __('Logout')%></a>
			</div>
		</div>

	</div>
	<div class="modal-footer">
		<a href="#" class="modal-close waves-effect waves-light deezloader-primary btn" id="modal_settings_btn_saveSettings"><i
			class="material-icons right">save</i><%= __('Save')%></a>
		<a href="#" class="waves-effect btn-flat" id="modal_settings_btn_defaultSettings"><i
			class="material-icons right">settings_backup_restore</i><%= __('Default Settings')%></a>
		<a href="#" class="modal-close waves-effect btn-flat"><%= __('Close')%></a>
	</div>
</div>

<!--#############################################MODAL_TAGS############################################-->
<div id="modal_tags" class="modal modal-fixed-footer">
	<div class="modal-content">
		<div class="row">
			<h4 class="col s12"><%= __('Saved Tags')%></h4>
		</div>
		<div class="row">
			<p class="col s12 m4">
				<label>
					<input type="checkbox" id="modal_tags_title" class="filled-in"/>
					<span><%= __('Title')%></span>
				</label>
			</p>
			<p class="col s12 m4">
				<label>
					<input type="checkbox" id="modal_tags_artist" class="filled-in"/>
					<span><%= __('Artist')%></span>
				</label>
			</p>
			<p class="col s12 m4">
				<label>
					<input type="checkbox" id="modal_tags_album" class="filled-in"/>
					<span><%= __('Album')%></span>
				</label>
			</p>
			<p class="col s12 m4">
				<label>
					<input type="checkbox" id="modal_tags_cover" class="filled-in"/>
					<span><%= __('Cover')%></span>
				</label>
			</p>
			<p class="col s12 m4">
				<label>
					<input type="checkbox" id="modal_tags_trackNumber" class="filled-in"/>
					<span><%= __('Track Number')%></span>
				</label>
			</p>
			<p class="col s12 m4">
				<label>
					<input type="checkbox" id="modal_tags_trackTotal" class="filled-in"/>
					<span><%= __('Track Total')%></span>
				</label>
			</p>
			<p class="col s12 m4">
				<label>
					<input type="checkbox" id="modal_tags_discNumber" class="filled-in"/>
					<span><%= __('Disc Number')%></span>
				</label>
			</p>
			<p class="col s12 m4">
				<label>
					<input type="checkbox" id="modal_tags_discTotal" class="filled-in"/>
					<span><%= __('Disc Total')%></span>
				</label>
			</p>
			<p class="col s12 m4">
				<label>
					<input type="checkbox" id="modal_tags_albumArtist" class="filled-in"/>
					<span><%= __('Album Artist')%></span>
				</label>
			</p>
			<p class="col s12 m4">
				<label>
					<input type="checkbox" id="modal_tags_genre" class="filled-in"/>
					<span><%= __('Genre')%></span>
				</label>
			</p>
			<p class="col s12 m4">
				<label>
					<input type="checkbox" id="modal_tags_year" class="filled-in"/>
					<span><%= __('Year')%></span>
				</label>
			</p>
			<p class="col s12 m4">
				<label>
					<input type="checkbox" id="modal_tags_date" class="filled-in"/>
					<span><%= __('Date')%></span>
				</label>
			</p>
			<p class="col s12 m4">
				<label>
					<input type="checkbox" id="modal_tags_explicit" class="filled-in"/>
					<span><%= __('Explicit')%></span>
				</label>
			</p>
			<p class="col s12 m4">
				<label>
					<input type="checkbox" id="modal_tags_isrc" class="filled-in"/>
					<span>ISRC</span>
				</label>
			</p>
			<p class="col s12 m4">
				<label>
					<input type="checkbox" id="modal_tags_length" class="filled-in"/>
					<span><%= __('Length')%></span>
				</label>
			</p>
			<p class="col s12 m4">
				<label>
					<input type="checkbox" id="modal_tags_barcode" class="filled-in"/>
					<span><%= __('Barcode')%></span>
				</label>
			</p>
			<p class="col s12 m4">
				<label>
					<input type="checkbox" id="modal_tags_bpm" class="filled-in"/>
					<span>BPM</span>
				</label>
			</p>
			<p class="col s12 m4">
				<label>
					<input type="checkbox" id="modal_tags_replayGain" class="filled-in"/>
					<span><%= __('Replay Gain')%></span>
				</label>
			</p>
			<p class="col s12 m4">
				<label>
					<input type="checkbox" id="modal_tags_publisher" class="filled-in"/>
					<span><%= __('Label')%></span>
				</label>
			</p>
			<p class="col s12 m4">
				<label>
					<input type="checkbox" id="modal_tags_unsynchronisedLyrics" class="filled-in"/>
					<span><%= __('Unsynchronised Lyrics')%></span>
				</label>
			</p>
			<p class="col s12 m4">
				<label>
					<input type="checkbox" id="modal_tags_copyright" class="filled-in"/>
					<span><%= __('Copyright')%></span>
				</label>
			</p>
			<p class="col s12 m4">
				<label>
					<input type="checkbox" id="modal_tags_musicpublisher" class="filled-in"/>
					<span><%= __('Publisher')%></span>
				</label>
			</p>
			<p class="col s12 m4">
				<label>
					<input type="checkbox" id="modal_tags_composer" class="filled-in"/>
					<span><%= __('Composer')%></span>
				</label>
			</p>
			<p class="col s12 m4">
				<label>
					<input type="checkbox" id="modal_tags_mixer" class="filled-in"/>
					<span><%= __('Mixer')%></span>
				</label>
			</p>
			<p class="col s12 m4">
				<label>
					<input type="checkbox" id="modal_tags_author" class="filled-in"/>
					<span><%= __('Author')%></span>
				</label>
			</p>
			<p class="col s12 m4">
				<label>
					<input type="checkbox" id="modal_tags_writer" class="filled-in"/>
					<span><%= __('Writer')%></span>
				</label>
			</p>
			<p class="col s12 m4">
				<label>
					<input type="checkbox" id="modal_tags_engineer" class="filled-in"/>
					<span><%= __('Engineer')%></span>
				</label>
			</p>
			<p class="col s12 m4">
				<label>
					<input type="checkbox" id="modal_tags_producer" class="filled-in"/>
					<span><%= __('Producer')%></span>
				</label>
			</p>
		</div>
	</div>
	<div class="modal-footer">
		<a href="#" class="modal-close waves-effect btn-flat"><%= __('Close')%></a>
	</div>
</div>

<!--#############################################MODAL_ABOUT############################################-->
<div id="modal_about" class="modal modal-fixed-footer">
	<div class="modal-content">
		<div class="row">
			<h4 class="col s12"><%= __('About the App')%></h4>
		</div>
		<div class="row">
			<ul class="collapsible" data-collapsible="accordion">
				<li>
					<div class="collapsible-header waves-effect"><i class="material-icons">info</i><%= __('About')%></div>
					<div class="collapsible-body">
						<p>
							<b><%= __('Branch')%>: </b>Remix</br>
							<b><%= __('Version')%>:</b> <span id="application_version_about"></span><br/>
							<b><%= __('Based on')%>: </b>Deezloader Reborn</br>
							<b><%= __('Maintainers')%>:</b> RemixDevs Group<br/>
							<b><%= __('Repo')%>: </b> <a href="https://notabug.org/RemixDevs/DeezloaderRemix" target="_blank">Official Repo</a><br/>
							<b><%= __('FAQ')%>: </b> <a href="https://notabug.org/RemixDevs/DeezloaderRemix/wiki/FAQ" target="_blank">Link</a><br/>
							<b><%= __('Official mirrors')%>: </b> <a href="https://notabug.org/RemixDevs/DeezloaderRemix/wiki/Downloads" target="_blank">Link</a><br/>
							<b><%= __('Interface')%>:</b> <a href="http://materializecss.com/" target="_blank">Materialize CSS</a><br/>
							<br/>
							<b><%= __('Telegram Contacts')%></b><br/>
							<b><a href="https://t.me/RemixDevs" target="_blank"><%= __('News Channel')%></a></b><br/>
							<b><a href="https://t.me/DeezloaderRemixBeta" target="_blank"><%= __('Betas Channel')%></a></b><br/>
							<b><a href="https://t.me/DeezloaderRemix" target="_blank"><%= __('Stable Releases Channel')%></a></b><br/>
							<br>
							<b><%= __('Special Thanks to')%>:</b><br>
							BasCurtiz for the app UI Design<br>
							ZzMTV for the original Deezloader code<br>
							ParadoxalManiak, snwflake and ExtendLord for maintaining the previous branches<br>
							<br>
							<b>Translations:</b><br>
							Italian: RemixDev
							German: lollilol, Tobs<br>
							Spanish: Wanamingo<br>
							Turkish: Metep<br>
							Brazilian Portuguese: C4RLETH<br>
							Thai: RadiusGreenhill<br>
							French: Didiou, kaypa<br>
						</p>
					</div>
				</li>
				<li>
					<div class="collapsible-header waves-effect"><i class="material-icons">feedback</i><%= __('Feedback')%></div>
					<div class="collapsible-body">
						<p>
							<%- __('Feedback_Text')%>
						</p>
					</div>
				</li>
				<li>
					<div class="collapsible-header waves-effect"><i class="material-icons">bug_report</i><%= __('Reporting Bugs')%></div>
					<div class="collapsible-body">
						<p>
							<%- __('Bugs_Text')%>
						</p>
					</div>
				</li>
				<li>
					<div class="collapsible-header waves-effect"><i class="material-icons">group</i><%= __('Contacts')%></div>
					<div class="collapsible-body">
						<p>
							<%- __('Contacts_Text')%><br>
							<ul>
								<li><a href="https://t.me/DeezloaderItalia">Gruppo in Italiano</a></li>
								<li><a href="https://t.me/joinchat/Ed1JxEn3_Bx1et6SCeLurg">Grupo en español</a></li>
								<li><a href="https://t.me/deezloaderpt">Grupo em Português</a></li>
						</ul>
						</p>
					</div>
				</li>
				<li>
					<div class="collapsible-header waves-effect"><i class="material-icons">warning</i><%= __('Attention!')%></div>
					<div class="collapsible-body">
						<p><%- __('Attention_Text')%></p>
					</div>
				</li>
				<li>
					<div class="collapsible-header waves-effect"><i class="material-icons">history</i><%= __('Changelog')%></div>
					<div class="collapsible-body">
						<p>
							<b>Version 4.2.2</b><br/>
							- Re-added login with email / password with captcha popup (Doesn't work on Server Mode)<br/>
							- Reorganized Settings<br/>
							- ID3 default is now the only option for MP3 date format (If you had that selected you should change that or do a clean install)<br/>
							- Added link analyzer<br/>
							- Added support for spotify tracks and albums via urls and uri<br/>
							- Added %bitrate% and %date% to album folder name<br/>
							- Added %date% to tracknames<br/>
							- Added %position% for playlist tracknames<br/>
							- Added %isrc%, %upc% and %album_id%<br/>
							- Added option to enable or disable search fallback<br/>
							- Added option to create album/artist/cd folders for playlists as well<br/>
							- Added option to save playlist as a compilation (it overwrites original tags with the playlist one)<br/>
							- Added more UI elements to display errors<br/>
							- Added error log when clicking on error sign in the Download Tab<br/>
							- Added quality selection to remaining download buttons<br/>
							- Fixed certificate error while looking for updates<br/>
							- Fixed spotify playlist conversion problems<br/>
							- Fixed tags problems<br/>
							- Other Minor improvments<br/>
							<br/>
							<b>Version 4.2.1</b><br/>
							- Downloads are binded to the server on server mode<br/>
							- Downloading playlists wont create artist and album folders if options are selected<br/>
							- Date tag is now enabled by default on new installations<br/>
							- Now users without propic will have a default one in the settings<br/>
							- Update message only nags once per client<br/>
							- Added space after %explicit% if there is text after the tag<br/>
							- Added label at the end of album viewin the modal<br/>
							- Fixed forEach error when downloading tracks<br/>
							- Fixed problem where %type% could be empty<br/>
							- Fixed macOS copy-paste problem<br/>
							- Fixed duplicate detection when downloading tracks<br/>
							- Fixed null separator for multitags on FLACs<br/>
							- Fixed problem where m3u file on multidisc albums was wrong<br/>
							<br/>
							<b>Version 4.2.0</b><br/>
							- New login workflow<br/>
							- Improved UI<br/>
							- Revamped album, artists and playlist modals<br/>
							- Added option to download the track in a different quality over the one selected (right click on d/l button)<br/>
							- Added autologin by default to fix re-connection problems<br/>
							- Re-added fallback on track errors<br/>
							- Fixed Default Settings button<br/>
							- Fixed links not working in server mode<br/>
							- Fixed UI problems when on mobile view (responsive site)<br/>
							- Fixed Settings menu not being populated on mobile view<br/>
							- Fixed problem with the artist tag when downloading playlists and albums<br/>
							- Fixed playlist numbering on files (now it doesn't override the trackNumber tag)<br/>
							- Fixed aritst artwork not saving<br/>
							<br/>
							<b>Version 4.1.8</b><br/>
							- Fix the issue where some people wasn't able to log in from the Netherlands<br/>
							<br/>
							<b>Version 4.1.7</b><br/>
							- Partial rewrite of the app (4.2.0 will have the other half)<br/>
							- Fixed login security issue<br/>
							- Better Spotify integration (now conversion uses ISRC if found)<br/>
							- Fixed France Charts not showing up<br/>
							- Albums with only one track will download as a single track<br/>
							- Added option %genre% for Track and Album names<br/>
							- Added support for subfolders in Album name<br/>
							- Minor changes to the UI<br/>
							<br/>
							<b>Version 4.1.6</b><br/>
							- Fixed Spotify Playlist problem<br/>
							- Fixed security issue where Client Secret is exposed in Compiled binaries<br/>
							- Now to use Spotify Features you need to follow <a href="https://notabug.org/RemixDevs/DeezloaderRemix/wiki/Spotify+Features" target="_blank">this guide</a> first<br/>
							- Minor bugfixes and improvments<br/>
							<br/>
							<b>Version 4.1.5</b><br/>
							- Fixed %explicit% for album names<br/>
							- Added Contributions page<br/>
							- Fixed some spelling issues<br/>
							<br/>
							<b>Version 4.1.4</b><br/>
							- Improved Privacy in Server Mode<br/>
							- Cleaned up some files<br/>
							- Fixed Day Month position in DATE tag<br/>
							- Fixed %explicit% in name templates<br/>
							- Fixed artist download<br/>
							- Fixed FLAC Problems (not all of them)<br/>
							- Fixed select folder cancel bug<br/>
							- Added Update Notification<br/>
							- Added default ID3 DATE tag format<br/>
							- Added minimize to system tray<br/>
							- Added multitag separator for FLACS<br/>
							- Added hyperlinks to artist & album<br/>
							- Added option to better remove duplicates in the artist tag (Still in BETA)<br/>
							- Added option to save the track with the full list of artist in the filename<br/>
							- Added option to overwrite padding size<br/>
							- Added "Download All" button in modals<br/>
							- Removed ReplayGain as default setting<br/>
							<br/>
							<b>Version 4.1.3</b><br/>
							- Playlist and Album tracks now have fallback support<br/>
							- M3U files now works correctly<br/>
							- Fixed problems with tags<br/>
							- Added option %explicit% for Track and Album names (Will add "(Explicit)" in that position if it's explicit)<br/>
							- Added option to remove "(Album Version)" from track title<br/>
							- Added options to select which format should the date tag have<br/>
							- Added option to not fallback if desired bitrate is not available<br/>
							- Logging enhancements<br/>
							- Other minor bug-fixing<br/>
							<br/>
							<b>Version 4.1.2</b><br/>
							- Fixed Login Problem (for real this time)<br/>
							- Fixed Login after refresh<br/>
							- Regionlock free download<br/>
							- Added support for download of User Uploaded tracks<br/>
							- Now you can select which tags your songs has<br/>
							- Fixed selecting problem<br/>
							- Tracks without preview will display a disabled play button<br/>
							- Previews inside modal will stop with modal close<br/>
							- New %label% field for tracks and albums<br/>
							- Added option to create folder for CDs<br/>
							- Added rename option for cover file<br/>
							- Added option to download Artist artwork<br/>
							- Added option do log downloaded alternative tracks<br/>
							- Fixed some minor bugs<br/>
							<br/>
							<b>Version 4.1.1</b><br/>
							- Fixed Login Problem (again)<br/>
							- Added Dark Mode<br/>
							- Added smaller cover option<br/>
							- Added support for lower bitrates<br/>
							- Added "Stop All Downloads" button<br/>
							- Added support for Spotify Playlist preview<br/>
							- Added support for PNG covers<br/>
							- Re-Added Date Tag<br/>
							- Fixed same cover for same track in different albums bug<br/>
							- Fixed login issue from repository build<br/>
							<br/>
							<b>Version 4.1.0</b><br/>
							- New UI (not completly optimized for small screens)<br/>
							- Fixed login problems<br/>
							- Fixed %type% parameter not working<br/>
							- Fixed year tagging problem<br/>
							- Fixed playlist file not containing tracks<br/>
							- More precision in Spotify Playlist conversion<br/>
							<br/>
							<a href="https://notabug.org/RemixDevs/DeezloaderRemix/wiki/Changelog" target="_blank"><%= __('Full Changelog Here')%></a>
						</p>
					</div>
				</li>
				<li>
					<div class="collapsible-header waves-effect"><i class="material-icons">copyright</i><%= __('License')%></div>
					<div class="collapsible-body">
						<p>
							<a rel="license" href="https://www.gnu.org/licenses/gpl-3.0.en.html" target="_blank">
								<img alt="GNU General Public License" style="border-width:0"
										 src="https://www.gnu.org/graphics/gplv3-127x51.png"/>
							</a><br/>
							This work is licensed under a <a rel="license" href="https://www.gnu.org/licenses/gpl-3.0.en.html" target="_blank">GNU General Public License 3.0</a>.
						</p>
					</div>
				</li>
				<li>
					<div class="collapsible-header waves-effect"><i class="material-icons">favorite</i><%= __('Contributions')%></div>
					<div class="collapsible-body">
						<%- __('Contributions_Text')%>
						<p>
							PayPal: <a href="https://paypal.me/RemixDev" target="_blank">PayPal.me/RemixDev</a><br>
							Bitcoin: 1sdNymSJrMBWyHM4u2m9uco5nv6uV4Qs1<br>
							Ethereum: 0x1d2aa67e671485CD4062289772B662e0A6Ff976c
						</p>
					</div>
				</li>
			</ul>
		</div>
	</div>
	<div class="modal-footer">
		<a href="#" class="modal-close waves-effect btn-flat"><%= __('Close')%></a>
	</div>
</div>

<!--##########################################MODAL_TRACKLIST###########################################-->
<div id="modal_trackList" class="modal modal-fixed-footer modal-custom-header">
	<div class="modal-content">
		<div class="trackList-header" v-bind:style="{ 'background-image': `linear-gradient(to bottom, transparent 0%, var(--main-modal-background) 100%), url('${image}')` }">
			<h4>{{ title }}</h4>
			<h6 v-if="metadata" style="display: inline;">{{ metadata }}</h6>
			<span class="right hide-on-small-only" v-if="release_date"> {{ release_date }} </span>
		</div>
		<div class="modal-container">
			<table class="highlight col s12">
				<thead>
				<tr>
					<td v-for="data in head" v-html="data.title" v-bind:style = "{ 'width': `${data.width ? data.width : 'auto'}`}" v-bind:class="{ 'hide-on-med-and-up' : data.smallonly, 'hide-on-small-only': data.hideonsmall }"></td>
				</tr>
				</thead>
				<tbody id="modal_trackList_table_trackList_tbody_loadingIndicator" class="hide">
				<tr>
					<td class="center" colspan="6">
						<div class="preloader-wrapper big active">
							<div class="spinner-layer">
								<div class="circle-clipper left">
									<div class="circle"></div>
								</div>
								<div class="gap-patch">
									<div class="circle"></div>
								</div>
								<div class="circle-clipper right">
									<div class="circle"></div>
								</div>
							</div>
						</div>
					</td>
				</tr>
				</tbody>
				<tbody id="modal_trackList_table_trackList_tbody_trackList" class="hide">
				</tbody>
			</table>
		</div>
	</div>
	<div class="modal-footer">
		<a href="#" id="download_all_tracks" v-bind:data-link="link" class="btn btn-flat waves-effect waves-light left"><%= __('Download {{ type }}', {type: '{{ type }}'})%></a>
		<a href="#" class="modal-close waves-effect btn-flat"><%= __('Close')%></a>
	</div>
</div>

<!--##########################################MODAL_TRACKLISTALBUM###########################################-->
<div id="modal_trackListSelective" class="modal modal-fixed-footer modal-custom-header">
	<div class="modal-content">
		<div class="trackList-header" v-bind:style="{ 'background-image': `linear-gradient(to bottom, transparent 0%, var(--main-modal-background) 100%), url('${image}')` }">
			<h4>{{ title }} <i v-if="explicit" class="material-icons valignicon materialize-red-text tooltipped" data-tooltip="Explicit">explicit</i></h4>
			<h6 v-if="metadata" style="display: inline;">{{ metadata }}</h6>
			<span class="right hide-on-small-only" v-if="release_date">{{ release_date }}</span>
		</div>
		<div class="modal-container">
			<table class="highlight col s12">
				<thead>
				<tr>
					<td v-for="data in head" v-html="data.title" v-bind:style = "{ 'width': `${data.width ? data.width : 'auto'}`}" v-bind:class="{ 'hide-on-med-and-up' : data.smallonly, 'hide-on-small-only': data.hideonsmall }"></td>
				</tr>
				</thead>
				<tbody id="modal_trackListSelective_table_trackListSelective_tbody_loadingIndicator" class="hide">
				<tr>
					<td class="center" colspan="6">
						<div class="preloader-wrapper big active">
							<div class="spinner-layer">
								<div class="circle-clipper left">
									<div class="circle"></div>
								</div>
								<div class="gap-patch">
									<div class="circle"></div>
								</div>
								<div class="circle-clipper right">
									<div class="circle"></div>
								</div>
							</div>
						</div>
					</td>
				</tr>
				</tbody>
				<tbody id="modal_trackListSelective_table_trackListSelective_tbody_trackListSelective" class="hide">
				</tbody>
			</table>
			<span v-if="label" style="opacity: 0.40;margin-top: 8px;display: inline-block;font-size: 13px;">{{ label }}</span>
		</div>
	</div>
	<div class="modal-footer">
		<a href="#" id="download_all_tracks_selective" v-bind:data-link="link" class="btn btn-flat waves-effect waves-light left"><%= __('Download {{ type }}', {type: '{{ type }}'})%></a>
		<a href="#" id="download_track_selection" class="btn btn-flat waves-effect waves-light deezloader-primary white-text"><span class="hide-on-small-only"><%= __('Download selection')%><i class="material-icons right">file_download</i></span><i class="material-icons hide-on-med-and-up">file_download</i></a>
		<a href="#" class="modal-close waves-effect btn-flat"><%= __('Close')%></a>
	</div>
</div>

<!--##########################################MODAL_MSG###########################################-->
<div id="modal_msg" class="modal">
	<div class="modal-content">
		<div class="row">
			<h4 class="col s12" id="modal_msg_title"></h4>
		</div>
		<div class="row">
			<p style="white-space: pre-line" class="col s12" id="modal_msg_message"></p>
		</div>
	</div>
	<div class="modal-footer">
		<a href="#" class="modal-close waves-effect waves-light btn"><%= __('I got it!')%></a>
	</div>
</div>

<!--##########################################MODAL_ANALYZER_COUNTRY###########################################-->
<div id="modal_link_analyzer_country" class="modal modal-fixed-footer">
	<div class="modal-content">
		<h4 class="col s12"><%= __('Available Countries for')%> {{ title }}</h4>
		<table class="striped col s12">
			<thead>
				<tr>
					<th style="width:24px;"></th>
					<th><%= __('Country')%></th>
				</tr>
			</thead>
			<tbody>
				<tr v-for="cc in countries">
					<td v-for="val in cc">{{ val }}</td>
				</tr>
			</tbody>
		</table>
	</div>
	<div class="modal-footer">
		<a href="#" class="modal-close waves-effect waves-light btn"><%= __('Close')%></a>
	</div>
</div>

<!--********************************************MAIN-CONTENT********************************************-->
<nav>
	<div class="nav-wrapper">
		<div class="brand-logo center hide-on-small-only">Deezloader <b>Remix</b></div>
		<ul class="left hide-on-small-only">
			<li>
				<div class="switch">
					<label>
						<i class="material-icons left white-text" style="margin-right: 0px; margin-left: 15px;">brightness_2</i>
						<input id="nightTimeSwitcher" type="checkbox">
						<span class="lever"></span>
					</label>
				</div>
			</li>
		</ul>
		<a href="#" data-target="slide-out" class="sidenav-trigger hide-on-med-and-up right"><i class="material-icons">menu</i></a>
		<ul id="nav-mobile" class="right hide-on-small-only">
			<li>
				<a href="#modal_settings" id="nav_btn_openSettingsModal" class="waves-effect waves-light modal-trigger">
					<i class="material-icons left">settings</i> <span class="hide-on-med-and-down"><%= __('Settings')%></span>
				</a>
			</li>
			<li>
				<a href="#modal_about" class="waves-effect waves-light modal-trigger">
					<i class="material-icons left">info</i> <span class="hide-on-med-and-down"><%= __('About')%></span>
				</a>
			</li>
		</ul>
	</div>
</nav>

<img src="img/icon.svg" class="circle" id="main_icon"></img>

<ul id="slide-out" class="sidenav">
	<li><div class="user-view">
		<div class="background"></div>
		<a href="#user"><img class="circle" id="side_avatar"></a>
		<a href="#name"><span class="white-text name" id="side_user"></span></a>
		<a href="#email"><span class="white-text email" id="side_email"></span></a>
	</div></li>
	<li><a href="#!" tab-id="tab_search" class="sidenav_tab sidenav-close waves-effect"><i class="material-icons">search</i><%= __('Search')%></a></li>
	<li><a href="#!" tab-id="tab_charts" class="sidenav_tab sidenav-close waves-effect"><i class="material-icons">bubble_chart</i><%= __('Charts')%></a></li>
	<li><a href="#!" tab-id="tab_playlists" class="sidenav_tab sidenav-close waves-effect"><i class="material-icons">playlist_play</i><%= __('Playlists')%></a></li>
	<li><a href="#!" tab-id="tab_link" class="sidenav_tab sidenav-close waves-effect"><i class="material-icons">link</i><%= __('Link Analyzer')%></a></li>
	<li><a href="#!" tab-id="tab_url" class="sidenav_tab sidenav-close waves-effect"><i class="material-icons">link</i><%= __('Download from URL')%></a></li>
	<li><a href="#!" tab-id="tab_downloads" class="sidenav_tab sidenav-close waves-effect"><i class="material-icons">get_app</i><%= __('Downloads')%></a></li>
	<li><div class="divider"></div></li>
	<li><a href="#modal_settings" id="sidenav_settings" class="waves-effect sidenav-close modal-trigger"><i class="material-icons">settings</i><%= __('Settings')%></a></li>
	<li><a href="#modal_about" class="waves-effect sidenav-close modal-trigger"><i class="material-icons">info</i><%= __('About')%></a></li>
	<li><a href="#!" id="nightModeSwitch2"><i class="material-icons">brightness_2</i><%= __('Enable Night Mode')%></a>
	</li>
</ul>

<main class="container">
	<ul id="tab-nav" class="row tabs tabs-fixed-width hide-on-small-only">
		<li class="tab"><a class="active" href="#tab_search"><%= __('Search')%></a></li>
		<li class="tab"><a href="#tab_charts"><%= __('Charts')%></a></li>
		<li class="tab"><a href="#tab_playlists"><%= __('Playlists')%></a></li>
		<li class="tab"><a href="#tab_link"><%= __('Link Analyzer')%></a></li>
		<li class="tab"><a href="#tab_url"><%= __('Download from URL')%></a></li>
		<li class="tab"><a href="#tab_downloads"><%= __('Downloads')%></a></li>
	</ul>

	<div id="main-content" class="row">

		<div id="tab_search">
			<form id="tab_search_form_search">
				<div class="inline-input-group col s12">
					<input autocomplete="off" id="tab_search_form_search_input_searchString" type="search" class="input" placeholder="<%= __('Start searching...')%>">
					<button class="btn btn-input btn-flat deezloader-primary white-text"><i class="material-icons">search</i></button>
				</div>
				<div class="row center">
					<p class="col s3">
						<label>
						<input name="searchMode" type="radio" class="with-gap" id="tab_search_radio_searchMode_song" value="track" checked/>
						<span><i class="material-icons show-on-small-only left deezloader-primary-text">music_note</i><span class="hide-on-med-and-down"><%= __('Song')%></span></span>
						</label>
					</p>
					<p class="col s3">
						<label>
						<input name="searchMode" type="radio" class="with-gap" id="tab_search_radio_searchMode_album" value="album"/>
						<span><i class="material-icons show-on-small-only left deezloader-primary-text">album</i><span class="hide-on-med-and-down"><%= __('Album')%></span></span>
						</label>
					</p>
					<p class="col s3">
						<label>
						<input name="searchMode" type="radio" class="with-gap" id="tab_search_radio_searchMode_artist" value="artist"/>
						<span><i class="material-icons show-on-small-only left deezloader-primary-text">person</i><span class="hide-on-med-and-down"><%= __('Artist')%></span></span>
						</label>
					</p>
					<p class="col s3">
						<label>
							<input name="searchMode" type="radio" class="with-gap" id="tab_search_radio_searchMode_playlist" value="playlist"/>
							<span><i class="material-icons show-on-small-only left deezloader-primary-text">playlist_play</i><span class="hide-on-med-and-down"><%= __('Playlist')%></span></span>
						</label>
					</p>
				</div>
			</form>
			<div id="tab_search_results">
				<table id="tab_search_table_results" class="striped col s12">
					<thead class="hide-on-small-only">
						<tr class="hide" id="tab_search_table_results_thead_track">
							<th style="width: 56px;"><!--cover--></th>
							<th><%= __('Song')%></th>
							<th><%= __('Artist')%></th>
							<th><%= __('Album')%></th>
							<th><i class="material-icons">timer</i></th>
							<th style="width: 56px;"><!--download_link--></th>
						</tr>
						<tr class="hide" id="tab_search_table_results_thead_album">
							<th style="width: 56px;"><!--cover--></th>
							<th><%= __('Album')%></th>
							<th><%= __('Artist')%></th>
							<th><%= __('Songs')%></th>
							<th><%= __('Type')%></th>
							<th><!--space--></th>
							<th style="width: 56px;"><!--download_link--></th>
						</tr>
						<tr class="hide" id="tab_search_table_results_thead_artist">
							<th style="width: 56px;"><!--cover--></th>
							<th><%= __('Artist')%></th>
							<th><%= __('Albums')%></th>
							<th><!--space--></th>
							<th style="width: 56px;"><!--download_link--></th>
						</tr>
						<tr class="hide" id="tab_search_table_results_thead_playlist">
							<th style="width: 56px;"><!--cover--></th>
							<th><%= __('Name')%></th>
							<th><%= __('Songs')%></th>
							<th style="width: 56px;"><!--space--></th>
							<th style="width: 56px;"><!--download_link--></th>
						</tr>
					</thead>
					<tbody id="tab_search_table_results_tbody_loadingIndicator" class="hide loadingTab">
						<tr>
							<td class="center">
								<div class="preloader-wrapper big active">
									<div class="spinner-layer spinner-blue-only">
										<!-- Spinner Code -->
										<div class="circle-clipper left"><div class="circle"></div></div><div class="gap-patch"><div class="circle"></div></div><div class="circle-clipper right"><div class="circle"></div></div>
									</div>
								</div>
							</td>
						</tr>
					</tbody>
					<tbody id="tab_search_table_results_tbody_results"></tbody>
					<tbody id="tab_search_table_results_tbody_noResults" class="hide">
						<tr>
							<td class="center"><%= __('Nothing found!')%></td>
						</tr>
					</tbody>
				</table>
			</div>
		</div>

		<div id="tab_charts">
			<div class="input-field col s12">
				<select id="tab_charts_select_country" class="icons">
					<!--All country selects have to be like the following example:
					<option value="example" data-icon="images/sample.jpg" class="left circle">Example</option>
					-->
				</select>
				<label><%= __('Country')%></label>
			</div>
			<button id="downloadChartPlaylist" class="col s12 btn btn-input btn-flat deezloader-primary white-text" style="margin-bottom:8px;"><%= __('Download Playlist')%></button>
			<table id="tab_charts_table_charts" class="striped">
				<thead class="hide-on-small-only">
					<tr>
						<th>#</th>
						<th style="width: 56px;"><!--cover--></th>
						<th><%= __('Song')%></th>
						<th><%= __('Artist')%></th>
						<th><%= __('Album')%></th>
						<th><i class="material-icons">timer</i></th>
						<th style="width: 56px;"><!--download_link--></th>
					</tr>
				</thead>
				<tbody id="tab_charts_table_charts_tbody_loadingIndicator" class="loadingTab">
					<tr>
						<td colspan="7" class="center">
							<div class="preloader-wrapper big active">
								<div class="spinner-layer spinner-blue-only">
									<!-- Spinner Code -->
									<div class="circle-clipper left"><div class="circle"></div></div><div class="gap-patch"><div class="circle"></div></div><div class="circle-clipper right"><div class="circle"></div></div>
								</div>
							</div>
						</td>
					</tr>
				</tbody>
				<tbody id="tab_charts_table_charts_tbody_charts"></tbody>
			</table>
		</div>

		<div id="tab_playlists" class="row">
			<div class="col s12">
				<button class="btn-flat btn-large waves-effect deezloader-primary white-text" id="button_refresh_playlist_tab" style="width:100%;"><%= __('Refresh Playlists')%></button>
			</div>
			<div class="col s12">
				<table class="striped">
					<thead>
						<tr>
							<th style="width: 56px;"><!--cover--></th>
							<th><%= __('Name')%></th>
							<th><%= __('Songs')%></th>
							<th style="width: 56px;"><!--inspect_playlist--></th>
							<th style="width: 56px;"><!--download_link--></th>
						</tr>
					</thead>
					<tbody id="table_personal_playlists">
					</tbody>
				</table>
			</div>
		</div>

		<div id="tab_link">
			<div class="inline-input-group">
				<input autocomplete="off" type="search" id="link_analyzer_url" class="input" placeholder="<%= __('Song/Album URL')%>">
				<button id="link_analyzer_go" class="btn btn-input btn-flat deezloader-primary white-text"><i class="material-icons">search</i></button>
			</div>

			<div id="link_analyzer_loading" class="center" hidden>
				<div class="preloader-wrapper big active">
					<div class="spinner-layer spinner-blue-only">
						<!-- Spinner Code -->
						<div class="circle-clipper left"><div class="circle"></div></div><div class="gap-patch"><div class="circle"></div></div><div class="circle-clipper right"><div class="circle"></div></div>
					</div>
				</div>
			</div>

			<div id="link_analyzer_start">
				<p class="secondary-text center"><%- __('LinkAnalyzer_Info')%></p>
			</div>

			<div v-if="d.title" id="link_analyzer_song" class="link_analyzer_info">
				<div id="link_analyzer_song_sideinfo" class="hide-on-small-only link_analyzer_sideinfo">
					<img v-bind:src=" d.album.cover_medium "/>
					<a href="#modal_link_analyzer_country" class="modal-trigger waves-effect waves-light btn" style="width:100%;"><%= __('See Available Countries')%></a>
				</div>
				<div id="link_analyzer_song_maininfo" class="link_analyzer_maininfo">
					<h5 style="margin-bottom:8px; margin-top:0px;">{{ d.title }} {{ d.version }}<i v-if="d.explicit_lyrics" class="material-icons valignicon materialize-red-text tooltipped" data-tooltip="Explicit">explicit</i></h5>
					<p style="margin-top:0px;">by <b>{{ d.artist.name }}</b></br>
					in <b>{{ d.album.title }}</b></p>
					<hr class="hide-on-small-only">
					<a v-if="d.alternative" v-bind:href="'d.alternative.link'"><b><%= __('Alternative Link')%></b></a>
					<table class="striped">
						<tbody>
							<tr v-if="d.isrc"><td><b>ISRC</b></td><td>{{ d.isrc }}</td></tr>
							<tr v-if="d.duration"><td><b><%= __('Duration')%></b></td><td>{{ d.duration_string }}</td></tr>
							<tr v-if="d.disk_number"><td><b><%= __('Disc Number')%></b></td><td>{{ d.disk_number }}</td></tr>
							<tr v-if="d.track_position"><td><b><%= __('Track Number')%></b></td><td>{{ d.track_position }}</td></tr>
							<tr v-if="d.release_date"><td><b><%= __('Release Date')%></b></td><td>{{ d.release_date }}</td></tr>
							<tr v-if="d.bpm"><td><b>BPM</b></td><td>{{ d.bpm }}</td></tr>
						</tbody>
					</table>
					<a href="#modal_link_analyzer_country" class="modal-trigger waves-effect waves-light btn hide-on-med-and-up" style="width:100%;"><%= __('See Available Countries')%></a>
				</div>
			</div>

			<div v-if="d.title" id="link_analyzer_album" class="link_analyzer_info">
				<div id="link_analyzer_album_sideinfo" class="hide-on-small-only link_analyzer_sideinfo">
					<img v-bind:src=" d.cover_medium "/>
					<a v-on:click="showTrackListSelective(d.link)" class="waves-effect waves-light btn" style="width:100%;"><%= __('Show Tracklist')%></a>
				</div>
				<div id="link_analyzer_album_maininfo" class="link_analyzer_maininfo">
					<h5 style="margin-bottom:8px; margin-top:0px;">{{ d.title }} <i v-if="d.explicit_lyrics" class="material-icons valignicon materialize-red-text tooltipped" data-tooltip="Explicit">explicit</i></h5>
					<p style="margin-top:0px;">by <b>{{ d.artist.name }}</b></br>
					<b>{{ d.nb_tracks }}</b> {{ d.nb_tracks==1 ? 'track' : 'tracks' }}</p>
					<hr class="hide-on-small-only">
					<a v-if="d.alternative" v-bind:href="'d.alternative.link'"><b><%= __('Alternative Link')%></b></a>
					<table class="striped">
						<tbody>
							<tr v-if="d.upc"><td><b>UPC</b></td><td>{{ d.upc }}</td></tr>
							<tr v-if="d.duration"><td><b><%= __('Duration')%></b></td><td>{{ d.duration_string }}</td></tr>
							<tr v-if="d.release_date"><td><b><%= __('Release Date')%></b></td><td>{{ d.release_date }}</td></tr>
							<tr v-if="d.label"><td><b><%= __('Label')%></b></td><td>{{ d.label }}</td></tr>
							<tr v-if="d.record_type"><td><b><%= __('Record Type')%></b></td><td>{{ d.record_type.substring(0,1).toUpperCase()+ d.record_type.substring(1) }}</td></tr>
							<tr v-if="d.genres_string"><td><b><%= __('Genres')%></b></td><td>{{ d.genres_string }}</td></tr>
						</tbody>
					</table>
					<a v-on:click="showTrackListSelective(d.link)" class="waves-effect waves-light btn hide-on-med-and-up" style="width:100%;"><%= __('Show Tracklist')%></a>
				</div>
			</div>
		</div>

		<div id="tab_url">
			<div class="inline-input-group">
				<input autocomplete="off" type="search" id="song_url" class="input" placeholder="<%= __('DownloadURL_Info')%>">
				<button id="download_from_url_button" class="btn btn-input btn-flat deezloader-primary white-text"><i class="material-icons">get_app</i></button>
			</div>
		</div>

		<div id="tab_downloads">
			<div class="row">
				<div class="col s12 m4">
					<button id="openDownloadsFolder" style="width: 100%; margin-bottom:8px;" class="btn btn-flat btn-input btn-block deezloader-primary white-text">
						<%= __('Open Downloads Folder')%>
					</button>
				</div>
				<div class="col s12 m4">
					<button id="cancelAllTable" style="width: 100%; margin-bottom:8px;" class="btn btn-flat btn-input btn-block deezloader-primary white-text">
						<%= __('Cancel All Downloads')%>
					</button>
				</div>
				<div class="col s12 m4">
					<button id="clearTracksTable" style="width: 100%; margin-bottom:8px;" class="btn btn-flat btn-input btn-block deezloader-primary white-text">
						<%= __('Clear List')%>
					</button>
				</div>
			</div>
			<table id="tab_downloads_table_downloads" class="row">
				<thead>
					<tr>
						<th><%= __('Name')%></th>
						<th><%= __('Size')%></th>
						<th><%= __('Downloaded')%></th>
						<th><%= __('Failed')%></th>
						<th style="width: 25%;"><!--progress--></th>
						<th style="width: 56px;"><!--event buttons--></th>
					</tr>
				</thead>
				<tbody></tbody>
			</table>
		</div>

	</div>
</main>

<div class="fixed-action-btn" id="btn_scrollToTop" style="bottom: 45px; right: 24px;">
	<a class="btn-floating btn-large deezloader-primary scale-transition scale-out">
		<i class="large material-icons">keyboard_arrow_up</i>
	</a>
</div>
<audio id="preview-track">
	<source id="preview-track_source" src="" type="audio/mpeg">
</audio>

<div id="modal_quality" class="smallmodal">
	<!-- Modal content -->
	<div class="smallmodal-content">
		<a onclick="modalQualityButton(9)" href="#" id="download_track_selection" class="btn btn-flat waves-effect waves-light deezloader-primary white-text"><%= __('Download FLAC')%></a><br>
		<a onclick="modalQualityButton(3)" href="#" id="download_track_selection" class="btn btn-flat waves-effect waves-light deezloader-primary white-text"><%= __('Download MP3 320kbps')%></a><br>
		<a onclick="modalQualityButton(1)" href="#" id="download_track_selection" class="btn btn-flat waves-effect waves-light deezloader-primary white-text"><%= __('Download MP3 128kbps')%></a><br>
	</div>
</div>

<footer id="page_footer" class="darken-1 left page-footer hide-on-med-and-down valign-wrapper">
			<p><span style="position: relative;display: inline-block;transform: rotateY(180deg);">&copy;</span> Deezloader <%= __('original code by ZzMTV')%>.</p>
</footer>

<script>if (typeof module === 'object') {
	window.module = module;
	module = undefined;
}</script>

<script type="text/javascript" src="js/socket.io.js"></script>
<script type="text/javascript" src="js/jquery-3.3.1.min.js"></script>
<script type="text/javascript" src="js/materialize.min.js"></script>
<script type="text/javascript" src="js/i18n.min.js"></script>
<script type="text/javascript" src="js/vue.min.js"></script>
<script type="text/javascript" src="js/appBase.js"></script>
<script type="text/javascript" src="js/frontend.js"></script>
<script>if (window.module) module = window.module;</script>
</body>
</html>
